﻿@using EmoneyWeiXinEntity
@{
    
    Layout = null;
    List<ThemeEntity> themeNews = ViewBag.ThemeNewList;
    List<ThemeEntity> themeHots = ViewBag.ThemeHotList;
    bool color1 = false;
    bool color2 = false;
}
<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>首页</title>
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
    <link href="@Url.Content("~/Static/css/zttz.css")?@(new Random().Next())" rel="stylesheet" />
    <script src="@Url.Content("~/Static/Js/swipe.js")"></script>
    <script src="@Url.Content("~/Scripts/jquery-1.8.3.min.js")"></script>
</head>
<body>
    <header class="header">
        <a href="#" class="new_font new_font_hot" id="btnNewest">最新</a>
        <a href="#" class="new_font" id="btnHotest">最热</a>
    </header>
    <div class="focus" id="focus">
        <ul>
            @foreach (var item in themeNews.Take(4))
            {
                <li>
                    <h3><a href="@Url.Action("Detail", "ZTTZ")?themeId=@item.id">
                        <img src="@item.Theme_Photo_Rath"></a></h3>
                    <p style="text-align: center">
                        @*<i>
                            <img src="@Url.Content("~/Static/Image/forecast_img02.jpg")"></i>*@<span>@(item.Theme_Name)</span>
                    </p>
                </li>
            }
        </ul>
        <ol>
            <li class="on"></li>
            <li></li>
            <li></li>
            <li></li>
        </ol>
    </div>
    <!--指数-->
    <div class="zhishu">
        <ul class="ulZhuTiNews">
            @foreach (var item in themeNews)
            {
                <li code="@item.id" class="themeli">
                    <div class="zhishu_left @(color1 ? "red_bg" : "blue_bg")">
                        <h3>主题指数</h3>
                        <p>@((item.ClosePrice_Now + (item.ChangeRatio / 100 * item.ClosePrice_Now)).ToString("0.00"))</p>
                        <p>@(item.ChangeRatio.ToString("0.00"))%</p>
                    </div>
                    <div class="zhishu_right">
                        <h3>@item.Theme_Name</h3>
                        <p>创建时间：@item.Created_date.ToString("yyyy-MM-dd")</p>
                        <p>@(item.Theme_Info.Length > 15 ? item.Theme_Info.Substring(0, 15) : item.Theme_Info)</p>
                        <p class="red"><span style="float: left; color: red" class="width1">领涨股：@item.FirstStock.SecuAbbr</span> <span class="width2 @(item.FirstStock.ChangeRatio < 0 ? "green_bg" : "red_bg")" style="float: left; text-align:center">@(@item.FirstStock.ChangeRatio.Value.ToString("0.00"))%</span></p>
                    </div>
                </li>
                color1 = !color1;
            }
        </ul>

        <ul class="ulZhuTiHots" style="display: none">
            @foreach (var item in themeHots)
            {
                <li code="@item.id" class="themeli">
                    <div class="zhishu_left @(color2 ? "red_bg" : "blue_bg")">
                        <h3>主题指数</h3>
                        <p>@((item.ClosePrice_Now + (item.ChangeRatio / 100 * item.ClosePrice_Now)).ToString("0.00"))</p>
                        <p>@(item.ChangeRatio.ToString("0.00"))%</p>
                    </div>
                    <div class="zhishu_right">
                        <h3>@item.Theme_Name</h3>
                        <p>创建时间：@item.Created_date.ToString("yyyy-MM-dd")</p>
                        <p>@(item.Theme_Info.Length > 15 ? item.Theme_Info.Substring(0, 15) : item.Theme_Info)</p>
                        <p class="red"><span style="float: left; color: red" class="width1">领涨股：@item.FirstStock.SecuAbbr</span> <span class="width2 @(item.FirstStock.ChangeRatio < 0 ? "green_bg" : "red_bg")" style="float: left;text-align:center">@(@item.FirstStock.ChangeRatio.Value.ToString("0.00"))%</span></p>
                    </div>
                </li>
                color2 = !color2;
            }
        </ul>


       @* <p class="arrows">
            <a href="#">
                <img src="~/Static/Image/arrows_img.jpg"></a>
        </p>*@
    </div>
    <!--指数-->
</body>
<script type="text/javascript">
    $(function () {
        new Swipe(document.getElementById('focus'), {
            speed: 1000,
            auto: 6000,
            callback: function () {
                var lis = $(this.element).next("ol").children();
                lis.removeClass("on").eq(this.index).addClass("on");
            }
        });
    });

</script>



</html>

<script type="text/javascript">
    (function ($) {
        $(function () {
            initEvent();
        });

        function initEvent() {
            //切换到最新
            $("#btnNewest").click(function () {
                $("#btnHotest").removeClass("new_font_hot");
                $(this).addClass("new_font_hot");
                $(".ulZhuTiNews").show();
                $(".ulZhuTiHots").hide();
            });
            //切换到最热
            $("#btnHotest").click(function () {
                $("#btnNewest").removeClass("new_font_hot");
                $(this).addClass("new_font_hot");
                $(".ulZhuTiNews").hide();
                $(".ulZhuTiHots").show();
            });

            $(".themeli").click(function () {
                var $thisObj = $(this);
                var code = $thisObj.attr("code");
                window.location.href = "@Url.Action("Detail", "ZTTZ")?themeId=" + code;
            });
        }
    })(jQuery);
</script>
